<template>
	<view>
		<!-- 头部 -->
		<view class="homelife_head">
			<view v-for="(item,index) in headlist" :key="index" class="container_headbox" @click="Onhead(item)">
				<text :class="initData.param.type == item.code?'head_titlea':'head_titleb'">{{item.title}}</text>
				<view v-if="initData.param.type == item.code"></view>
			</view>
		</view>
		<view class="evaluate_list">
			<LoadMore ref="LoadMore" id="LoadMore" :diffHeight="124" :initData="initData" @dataRefresh='dataRefresh' v-if="Loadif">
			 <text></text>
				<view class="evaluate_lbos" v-for="(item,index) in list" :key="index">
					<view class="evaluate_bos">
						<image class="evaluate_image" mode="aspectFill" :src="item.user_info.headimgurl"></image>
						<view class="evaluate_all">
							<view class="evaluate_box">
								<view class="font15 font-323232 font-b">{{item.user_info.nickname}}</view>
								<view class="font14 font-969696">{{item.type=='consultation_order'?'图文问诊':item.type=='consultation_video_order'?'视频问诊':''}}</view>
							</view>
							<view class="evaluate_box">
								<view class="font15 font-323232 evaluate_rate">
									<text class="font14 font-323232">评分</text>
									<uni-rate :size="14" activeColor="#e9a944" allow-half :readonly="true" :value="item.fraction" />
								</view>
								<view class="font14 font-969696">{{item.createtime}}</view>
							</view>
						</view>
					</view>
					<view class="evaluate_info">
						{{item.content?item.content:'暂无'}}
					</view>
				</view>
			</LoadMore>
		</view>
	</view>
</template>

<script>
	import LoadMore from "@/components/loadMore.vue";
	export default {
		components: {
			LoadMore
		},
		data() {
			return {
				Loadif:false,
				list:[],//数据
				//传参数据
				initData: {
					url: 'listComment', //接口
					//data里得传参
					param: {
						type: 'consultation_order',
						// doctor_id:
					},
				},
				//头部列表
				headlist: [
					// {
					// 	title: '挂号评论',
					// 	id: 1,
					// 	code: 'hang'
					// },
					{
						title: '图文问诊',
						id: 2,
						code: 'consultation_order'
					},
					{
						title: '视频问诊',
						id: 3,
						code: 'consultation_video_order'
					},
					{
						title: '报告解读',
						id: 4,
						code: 'consultation_report_order'
					}
				],
			}
		},
		onLoad() {
			this.$Http({
				url: 'getUserInfo',
				type: 'POST',
				data: {}
			}).then(res => {
				if (res.code == 1) {
					this.initData.param.doctor_id =res.data.doctor_info.id
					this.Loadif = true
				}
			})
		},
		methods: {
			//返回数据
			dataRefresh(e) {
				e.forEach(item=>{
					item.createtime = this.$base.formatTime(new Date(item.createtime *
						1000), "yyyy/MM/dd")
				})
				this.list = e
			},
			//切换
			Onhead(res) {
				this.initData.param.type = res.code
				this.$refs.LoadMore.oncutRefresh(this.initData)
			},
		}
	}
</script>

<style>
	/* 头部 */
	.homelife_head {
		height: 124rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}

	.container_headbox {
		height: 50rpx;
	}

	.head_titlea {
		font-size: 30rpx;
		font-weight: 700;
		color: #323232;
	}

	.head_titleb {
		font-size: 30rpx;
		color: #969696;
	}

	.container_headbox view {
		height: 5rpx;
		background-color: #6bcbb6;
		border-radius: 3px;
		margin-top: 12rpx;
	}

	/* 数据 */
	.evaluate_list {
		width: 750rpx;
	}

	.evaluate_lbos {
		border-bottom: 1rpx #f6f6f6 solid;
		padding: 0rpx 30rpx 20rpx 30rpx;
		margin-bottom: 30rpx;
	}

	.evaluate_bos {
		width: 690rpx;
		display: flex;
		align-items: center;
		height: 140rpx;
	}

	.evaluate_image {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50rpx;
	}

	.evaluate_all {
		width: 590rpx;
		height: 140rpx;
	}

	.evaluate_box {
		height: 70rpx;
		width: 590rpx;
		padding-left: 32rpx;
		padding-right: 32rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.evaluate_rate {
		display: flex;
		align-items: center;
	}

	.evaluate_rate text {
		margin-right: 10rpx;
	}

	.evaluate_info {
		width: 690rpx;
		background-color: #f9f9f9;
		border-radius: 5rpx;
		font-size: 28rpx;
		color: #969696;
		padding: 26rpx;
	}

</style>
